import React from 'react';

/**
 * label style onSelected
 */
var Checkbox = React.createClass({
    getInitialState: function () {
        return ({
            isChecked: this.props.isChecked
        })
    },
    onSelected: function () {
        this.setState({
            isChecked:!this.state.isChecked
        },function(){
            if(this.state.isChecked && this.props.onSelected && typeof(this.props.onSelected) == "function"){
                this.props.onSelected();
            }
        });
    },
    isChecked:function(){
        return this.state.isChecked;
    },
    render: function () {
        return (
            <div style={this.props.style}  onClick={this.onSelected}>
                <span style={{width:"20px",height:"20px",display:"inline-block",cursor:"pointer"}}
                     >
                    <img src={this.state.isChecked?"/res/image/check_h.png":"/res/image/check.png"}/>
                </span>
                <span style={{marginLeft:"10px",cursor:"pointer"}}>{this.props.label}</span>
            </div>
        )
    }
});

module.exports = Checkbox;